import React from 'react';
import ReactDOM from 'react-dom';
//import PropTypes from 'prop-types';
class MyApp extends React.Component{
  constructor(props){
    super(props);
    this.state = {
      opacity:1
    };
    this.destoryComponent = this.destoryComponent.bind(this)
  }

  destoryComponent(){
    ReactDOM.unmountComponentAtNode(document.getElementById('root'));
  }
  componentDidMount(){
    let arr = [11, 23, 43, 15, 6 ,55];
    arr.sort((n1,n2) => {
    	return n1-n2;
    });
    alert(arr);
    this.intervalId = setInterval(() => {
      let {opacity} = this.state;
      console.log('定时器在执行');
      opacity -= 0.1;
      if(opacity <0){
        opacity = 1;
      }
      this.setState({opacity})
    }, 200);
  }
  componentWillUnmount(){
    clearInterval(this.intervalId)
    
  }
  render(){
    const {opacity} = this.state;
    return(
      <div>
        <h3 style={{opacity}}>React 学不会怎么办</h3>
        <button onClick={this.destoryComponent}>不学了</button>
      </div>
    );
  }
}

export default MyApp;

